{{!
  Copyright (c) HashiCorp, Inc.
  SPDX-License-Identifier: BUSL-1.1
~}}

<Breadcrumb @crumb={{hash label=this.policy.name args=(array "administration.policies.policy" this.policy.name)}} />
{{page-title "Policy"}}
<section class="section">
  <Hds::PageHeader as |PH|>
    <PH.Title data-test-title>{{this.policy.name}}</PH.Title>
    {{#if (can "destroy policy")}}
      <PH.Actions>
        <TwoStepButton
          data-test-delete-policy
          @alignRight={{true}}
          @idleText="Delete Policy"
          @cancelText="Cancel"
          @confirmText="Yes, Delete Policy"
          @confirmationMessage="Are you sure?"
          @awaitingConfirmation={{this.deletePolicy.isRunning}}
          @disabled={{this.deletePolicy.isRunning}}
          @onConfirm={{perform this.deletePolicy}}
        />
      </PH.Actions>
    {{/if}}
  </Hds::PageHeader>
	<PolicyEditor
		@policy={{this.policy}}
	/>

  {{#if (can "list token")}}
    <hr />

    <h2 class="title">
      Tokens
    </h2>

    {{#if (can "write token")}}
      <div class="token-operations">
        <div class="boxed-section">
          <div class="boxed-section-head">
            <h3>Create a Test Token</h3>
          </div>
          <div class="boxed-section-body">
            <p class="is-info">Create a test token that expires in 10 minutes for testing purposes.</p>
            <label>
              <button
                type="button"
                class="button is-info is-outlined create-test-token"
                data-test-create-test-token
                {{on "click" (perform this.createTestToken)}}
                >Create Test Token</button>
            </label>
          </div>
        </div>
        <div class="boxed-section">
          <div class="boxed-section-head">
            <h3>Create Tokens from the Nomad CLI</h3>
          </div>
          <div class="boxed-section-body">
            <p>When you're ready to create more tokens, you can do so via the <a class="external-link" href="https://developer.hashicorp.com/nomad/docs/commands" target="_blank" rel="noopener noreferrer">Nomad CLI <Hds::Icon @name="external-link" @isInline={{true}} /></a> with the following:
              <pre>
                <code>{{this.newTokenString}}</code>
                <CopyButton
                  data-test-copy-button
                  @clipboardText={{this.newTokenString}}
                  @compact={{true}}
                >
                </CopyButton>
              </pre>
            </p>
          </div>
        </div>
      </div>
    {{/if}}

    {{#if this.tokens.length}}
      <ListTable
        @source={{this.tokens}}
        @class="no-mobile-condense" as |t|>
        <t.head>
          <th>Name</th>
          <th>Created</th>
          <th>Expires</th>
          {{#if (can "destroy token")}}
            <th>Delete</th>
          {{/if}}
        </t.head>
        <t.body as |row|>
          <tr data-test-policy-token-row>
            <td data-test-token-name={{row.model.name}}>
              <Tooltip @text={{row.model.id}}>
                {{row.model.name}}
              </Tooltip>
            </td>
            <td>
              {{moment-from-now row.model.createTime interval=1000}}
            </td>
            <td>
              {{#if row.model.expirationTime}}
                <Tooltip @text={{row.model.expirationTime}}>
                  <span data-test-token-expiration-time class="{{if row.model.isExpired "has-text-danger"}}">{{moment-from-now row.model.expirationTime interval=1000}}</span>
                </Tooltip>
              {{else}}
                <span>Never</span>
              {{/if}}
            </td>
            {{#if (can "destroy token")}}
              <td class="is-200px">
                <Hds::Button @text="Delete Token" @color="critical"
                  data-test-delete-token-button
                  {{on "click" (perform this.deleteToken row.model)}}
                />
              </td>
            {{/if}}
          </tr>
        </t.body>
      </ListTable>
    {{else}}
      <div class="empty-message">
        <h3 data-test-empty-policies-list-headline class="empty-message-headline">
          No Tokens
        </h3>
        <p class="empty-message-body">
          No tokens are using this policy.
        </p>
      </div>
    {{/if}}
  {{/if}}

</section>
